<template>
	<view class="container">
		<TopNavVue />
		1212121
		<view class="overlay">


			<ModelComponents />
			<helang-tab-bar-bulge :fixed-bottom="true" :currents="1"></helang-tab-bar-bulge>
		</view>
	</view>
</template>

<script>
	import tabBarBulge from "@/uni_modules/helang-tabBar/components/helang-tabBar/tab-bar-bulge";
	import TopNavVue from "../../components/TopNav/TopNav.vue";
	import ModelComponents from "../../components/Model/Model.vue"

	export default {
		components: {
			"helang-tab-bar-bulge": tabBarBulge,
			TopNavVue,
			ModelComponents

		},
		data() {
			return {
			
			}
		},
		methods: {
			change(index) {
				console.log('Swiper changed to index:', index);
			},
			click(item) {
				console.log('Clicked item:', item);
			},
			click_1(name) {
				this.$refs.uToast.success(`点击了第${name}个`)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		position: relative;
		/* 允许子元素绝对定位 */

		/* 使容器高度占满整个视口 */
		overflow: hidden;
		background-color: white;
		/* 隐藏超出容器外的内容 */
	}

	.bg {
		position: absolute;
		/* 绝对定位 */
		top: 0;
		left: 0;
		width: 100%;
		/* 宽度占满 */
		height: 21%;
		/* 高度占满 */
		z-index: 1;
		/* 设置较低的层级 */
	}

	.overlay {
		position: relative;
		/* 回到正常流，确保绝对定位的背景能够显示 */
		z-index: 2;
		/* 确保覆盖在背景之上 */
		opacity: 0.9;
		/* 设置一定透明度 */
	}

	.grid-text {
		font-size: 14px;
		color: black;
		font-weight: 700;
		padding: 10rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}

	::v-deep .helang-tab-bar .bar.fixed.data-v-7a0948d1 {
		position: fixed;
		bottom: 0;
		left: 0;
		height: 119rpx;
		width: 750rpx;
	}
</style>